<template>
    <view class="zz-container zz-container_paySuccess">
        <!-- 成功的图标 -->
        <view class="zz-flex zz-jc-c">
            <text 
                :style="themeStyles.textMainColor"
                class="template__icon template_icon-pay-suc2"></text>
        </view>
        <!-- 成功的标题 -->
        <view class="zz-flex zz-jc-c title fs48 lh50 color333">{{'余额'}}·付款成功</view>
        <!-- 数据 -->
        <view>
            <view class="data first zz-flex zz-jc-sb">
                <!--  -->
                <view class="zz-jg_line zz-jg_line_h zz-jg_line_pos_lt zz-jg_line_bg"></view>
                <!--  -->
                <view class="fs28 lh40 color666">应付</view>
                <view class="fs28 lh40 color666">{{info.goodsPriceTotal}}</view>
            </view>
            <view class="data zz-flex zz-jc-sb">
                <view class="fs28 lh40 color666">优惠券</view>
                <view class="fs28 lh40 color666">-{{info.couponRemission}}</view>
            </view>
            <view class="data zz-flex zz-jc-sb">
                <view class="fs28 lh40 color666">会员</view>
                <view class="fs28 lh40 color666">-{{info.memberRemission}}</view>
            </view>
            <view class="data zz-flex zz-jc-sb">
                <view class="fs28 lh40 color666">实付</view>
                <view class="fs28 lh40 color666">{{info.totalFee}}</view>
            </view>
            <view class="data last zz-flex zz-jc-sb">
                <view class="fs28 lh40 color666">剩余</view>
                <view class="fs28 lh40 color666">{{info.moneyTotal}}</view>
                <!--  -->
                <view class="zz-jg_line zz-jg_line_h zz-jg_line_pos_lb zz-jg_line_bg"></view>
                <!--  -->
            </view>
        </view>
        <!-- 按钮 -->
        <view 
            :style="themeStyles.btnPrimary"
            class="zz-btn zz-btn_block zz-btn_style2"
            @click="backToResource">完成</view>
    </view>
</template>
<script>
const app = getApp();
export default {
    data(){
        return {
            info:{}
        };
    },
    onLoad(option){
        console.log("option", option);
		this.info = JSON.parse(option.info);
    },
    onShow(){
        
    },
    methods:{
        /* 返回跳转来的页面 */
        backToResource(){
            //console.log(app);
            //console.log(this.$api.prePage());
            uni.navigateBack();
        }
    }
}
</script>
<style lang="scss">
.zz-container_paySuccess {
    padding:100rpx 44rpx 0rpx;
    &>* {width:100%;}
    /*  */
    .template_icon-pay-suc2 {
        font-size:200rpx;
    }
    /*  */
    .title {
        margin-top:40rpx;
        margin-bottom:82rpx;
    }
    /*  */
    .data {
        margin-bottom:24rpx;
        padding:0rpx 80rpx;
        &.first {
            padding-top:22rpx;
        }
        &.last {
            padding-bottom:22rpx;
        }
    }
    /*  */
    .zz-btn_style2 {
        margin-top:314rpx;
    }
}
</style>